<template>
  <Modal v-model="modal" :title="title">
    <div class="public-setting-list-modal h500 scroll">
      <div class="title">
        <div>活动名称</div>
        <div>基础分</div>
        <div>上限分</div>
      </div>
      <div class="item" v-for="(item, index) in list" :key="item.id">
        <div>{{item.remark}}</div>
        <InputNumber style="widht:100" :max="99" :min="0" v-model="item.baseScore" @on-change="onChange(item, index)"></InputNumber>
        <InputNumber style="widht:100" :min="0" :max="100" v-model="item.limitScore" @on-change="onChange(item, index)"></InputNumber>
      </div>
    </div>
    <Loader :status="status"></Loader>
    <div slot="footer">
      <Button @click="modal = false" size="large" type="text">取消</Button>
      <Button :disabled="btnDisabled" @click="onSave" type="primary" size="large">确定</Button>
    </div>
  </Modal>
</template>
<script>
export default {
  data() {
    return {
      modal: false,
      title: '',
      status: 'pass',
      btnDisabled: false,
      list: []
    }
  },
  props: {
    distributor: {
      type: Array,
      default: () => []
    },
    salesman: {
      type: Array,
      default: () => []
    },
    store: {
      type: Array,
      default: () => []
    }
  },
  methods: {
    openModal (type) {
      this.btnDisabled = false
      if (type === 'distributor') {
        this.title = '经销商指标设置'
        this.list = this.distributor
      }
      if (type === 'salesman') {
        this.title = '业务员指标设置'
        this.list = this.salesman
      }
      if (type === 'store') {
        this.title = '门店指标设置'
        this.list = this.store
      }
      this.modal = true
    },
    closeModal () {
      this.modal = false
    },
    onChange (item, index) {
      if (item.limitScore === null) {
        this.$Message.warning(item.remark + '上限分不能为空')
        this.btnDisabled = true
        return false
      } else if (item.baseScore === null) {
        this.$Message.warning(item.remark + '基础分不能为空')
        this.btnDisabled = true
        return false
      } else if (item.limitScore !== null && item.baseScore !== null && item.limitScore >= item.baseScore) {
        this.btnDisabled = false
      } else {
        this.btnDisabled = false
      }
    },
    onSave () {
      if (this.btnDisabled) return
      this.status = 'loading'
      this.$jsonPost('/setting/race_config/batchUpdate', this.list).then(res => {
        this.status = 'pass'
        this.$Message.info('保存成功')
        this.$emit('complete')
      })
      .catch(() => {
        this.status = 'error'
      })
      this.modal = false
      this.btnDisabled = true
    }    
  }
}
</script>